<style scoped lang="less">
.page-index {
  overflow: auto;
}
.page-box {
  text-align: center;
  margin: 20px auto;
}
</style>
<template>
    <div class="page-index">
        <i-table stripe  border  :columns="columns" :data="data"></i-table>
        <!--分页内容-->
        <div class="page-box">
            <Page :total="pageTotal" @on-change="pageChange" :page-size="pageSize" show-elevator></Page>
        </div>
    </div>
</template>
<script>
export default {
  data() {
    return {
      self: this,
      pageIndex: 0,
      pageSize: 10,
      pageTotal: 0,
      columns: [
        {
          title: "奖品类型",
          key: "types",
          render: (h, params) => {
            return h("div", ['特等奖','一等奖','二等奖','三等奖','四等奖','参与奖'][params.row.types]);
          }
        },
        {
          title: "奖品名称",
          key: "name"
        },
        {
          title: "奖品数量",
          key: "num"
        },
        {
          title: "操作",
          key: "action",
          render: (h, params) => {
            return h("div", [
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px"
                  },
                  on: {
                    click: () => {
                      this.show(params);
                    }
                  }
                },
                "编辑"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "error",
                    size: "small"
                  },
                  on: {
                    click: () => {
                      this.remove(params);
                    }
                  }
                },
                "删除"
              )
            ]);
          }
        }
      ],
      data: []
    };
  },
  created() {
    var self = this;
    self.init();
  },
  methods: {
    init() {
      var self = this;

      var req = this.Axios.get(this.Interface.prizeList, {
        params: {
          pageIndex: this.pageIndex,
          pageSize: this.pageSize
        }
      });

      req.then(res => {
        var data = res.data;
        console.log(data);
        if (data.success) {
          var count = data.data.count;
          this.pageTotal = count;
          this.data = data.data.rows;
        } else {
          this.$Message.error(data.msg);
        }
      });
    },
    show(params) {
      console.log(params.row.id);

      this.$router.push({
        path: "/prize/add",
        query: {
          id: params.row.id
        }
      });
    },
    remove(params) {
      var self = this;
      var id = params.row.id;
      var datas = this.data;

      var req = this.Axios.post(this.Interface.prizeDel, {
        id: id
      });

      req.then(res => {
        var data = res.data;
        console.log(data);
        if (data.success) {
          console.log(params.index);
          self.data.splice(params.index, 1);

          this.$Message.success("删除成功");
        } else {
          this.$Message.error(data.msg);
        }
      });
    },
    pageChange() {
      var pageNum = arguments[0];
      this.pageIndex = pageNum - 1;
      this.init();
    }
  }
};
</script>
